import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from '../views/Home.vue'
import About from "../views/About";
import Error from "../components/Error";
import Collect from "../views/Collect";
import ShoppingCart from "../views/ShoppingCart";
import ConfirmOrder from "../views/ConfirmOrder";
import Commodity from "../views/Commodity";
import CommoditySearch from "../views/CommoditySearch";
import CommodityDetial from "../views/CommodityDetial";
import MyOrder from "../components/personalcenter/MyOrder";
import MyAddress from "../components/personalcenter/MyAddress";
import AddAddress from "../components/personalcenter/AddAddress";
import MyOrderUnpay from "../components/personalcenter/MyOrderUnpay";
import MyOrderAccount from "../components/personalcenter/MyOrderAccount";
Vue.use(VueRouter)


const routes = [
    {
        path: '/',
        name: 'Home',
        meta:{ title:"首页" },
        component: () => import("../views/Home")
    },
    {
        path: '/about',
        name: 'About',
        meta:{ title:"关于我们" },
        component: () => import("../views/About")
    },
    {
        path: '/error',
        name: 'Error',
        component: () => import("../components/Error")
    },
    {
        path: '/commodity',
        name: 'Commodity',
        meta:{ title:"全部商品" },
        component: () => import("../views/Commodity"),
    },
    {
        path: '/commoditysearch',
        name: 'CommoditySearch',
        component: () => import("../views/CommoditySearch"),
    },
    {
        path: '/commodity/detial',
        name: 'CommodityDetial',
        meta:{ title:"商品详情" },
        component: () => import("../views/CommodityDetial"),
    },
    {
        path: '/confirmOrder',
        name: 'ConfirmOrder',
        component: () => import("../views/ConfirmOrder"),
    },
    {
        path: '/collect',
        name: 'Collect',
        component: () => import("../views/Collect"),
        meta: {
            requireAuth: true, // 需要验证登录状态
            title:"我的收藏"
        }
    },
    {
        path: '/shoppingcart',
        name: 'ShoppingCart',
        component: () => import("../views/ShoppingCart"),
        meta: {
            requireAuth: true, // 需要验证登录状态
            title : "购物车"
        }
    },
    {
        path: '/personalcenter',
        component: () => import("../views/PersonalCenter"),
        meta: {
            requireAuth: true, // 需要验证登录状态
            title : "个人中心"
        },
        children: [
            {
                path: '',
                name: 'HomeIndex',
                component: MyOrder,
                meta: {
                    requireAuth: true, // 需要验证登录状态
                    title : "个人中心"
                },
            },
            {
                path: 'myAddress',
                name: 'MyAddress',
                component: MyAddress,
                meta: {
                    requireAuth: true // 需要验证登录状态
                },
            },
            {
                path: 'addAddress',
                name: 'AddAddress',
                component: AddAddress,
                meta: {
                    requireAuth: true // 需要验证登录状态
                },
            },
            {
                path: 'myOrder',
                name: 'MyOrder',
                component: MyOrder,
                meta: {
                    requireAuth: true // 需要验证登录状态
                },
            },
            {
                path: 'myOrderUnpay',
                name: 'MyOrderUnpay',
                component: MyOrderUnpay,
                meta: {
                    requireAuth: true // 需要验证登录状态
                },
            },
            {
                path: 'myOrderAccount',
                name: 'MyOrderAccount',
                component: MyOrderAccount,
                meta: {
                    requireAuth: true // 需要验证登录状态
                },
            },
        ]
    },
]



const router = new VueRouter({
    mode: 'history',
    base: process.env.BASE_URL,
    routes
})

router.beforeEach((to, from, next) => {//beforeEach是router的钩子函数，在进入路由前执行
    if (to.meta.title) {//判断是否有标题
        document.title = to.meta.title
    }
    next()//执行进入路由，如果不写就不会进入目标页
})

// 解决ElementUI导航栏中的vue-router在3.0版本以上重复点菜单报错问题
const originalPush = VueRouter.prototype.push
VueRouter.prototype.push = function push(location) {
    return originalPush.call(this, location).catch(err => err)
}

export default router
